<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>赋码管理操作测试</title>
    <style>
        body {
            font-family: 'Microsoft YaHei', sans-serif;
            padding: 20px;
            background: #f5f5f5;
        }
        .container {
            max-width: 1000px;
            margin: 0 auto;
            background: #fff;
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        .test-section {
            margin-bottom: 30px;
            padding: 20px;
            border: 1px solid #e6e6e6;
            border-radius: 6px;
        }
        .test-section h3 {
            color: #333;
            margin-top: 0;
            border-bottom: 2px solid #1e9fff;
            padding-bottom: 10px;
        }
        .btn {
            display: inline-block;
            padding: 8px 16px;
            margin: 5px;
            background: #1e9fff;
            color: white;
            text-decoration: none;
            border-radius: 4px;
            border: none;
            cursor: pointer;
        }
        .btn:hover {
            background: #0d8ae6;
        }
        .btn-danger {
            background: #ff5722;
        }
        .btn-danger:hover {
            background: #e64a19;
        }
        .result {
            margin-top: 15px;
            padding: 10px;
            border-radius: 4px;
            background: #f9f9f9;
            border-left: 4px solid #1e9fff;
        }
        .error {
            border-left-color: #ff5722;
            background: #fff5f5;
        }
        .success {
            border-left-color: #4caf50;
            background: #f0fff4;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>🔧 赋码管理操作功能测试</h1>
        
        <div class="test-section">
            <h3>📋 当前数据列表</h3>
            <button class="btn" onclick="loadData()">获取数据列表</button>
            <div id="dataList" class="result">点击按钮获取数据...</div>
        </div>
        
        <div class="test-section">
            <h3>👁️ 查看功能测试</h3>
            <p>输入要查看的记录ID：</p>
            <input type="number" id="viewId" placeholder="请输入ID" style="padding: 8px; margin-right: 10px;">
            <button class="btn" onclick="viewRecord()">查看记录</button>
            <div id="viewResult" class="result">等待操作...</div>
        </div>
        
        <div class="test-section">
            <h3>🗑️ 删除功能测试</h3>
            <p>输入要删除的记录ID：</p>
            <input type="number" id="deleteId" placeholder="请输入ID" style="padding: 8px; margin-right: 10px;">
            <button class="btn btn-danger" onclick="deleteRecord()">删除记录</button>
            <div id="deleteResult" class="result">等待操作...</div>
        </div>
        
        <div class="test-section">
            <h3>➕ 添加测试数据</h3>
            <button class="btn" onclick="addTestData()">添加测试数据</button>
            <div id="addResult" class="result">等待操作...</div>
        </div>
    </div>

    <script>
        // 获取数据列表
        function loadData() {
            fetch('/WarehouseManagement/Codingmanagement/GetCodingmanagements?page=1&limit=10')
                .then(response => response.json())
                .then(data => {
                    console.log('获取数据:', data);
                    let html = '<strong>数据列表：</strong><br>';
                    if (data.code === 0 && data.data && data.data.length > 0) {
                        html += `<p>总数：${data.count} 条</p>`;
                        data.data.forEach(item => {
                            html += `<div style="margin: 10px 0; padding: 10px; border: 1px solid #ddd; border-radius: 4px;">`;
                            html += `<strong>ID:</strong> ${item.id} | `;
                            html += `<strong>条码:</strong> ${item.barCode} | `;
                            html += `<strong>格式:</strong> ${item.barFormat} | `;
                            html += `<strong>业务编码:</strong> ${item.businessCode}`;
                            html += `</div>`;
                        });
                    } else {
                        html += '<p>暂无数据</p>';
                    }
                    document.getElementById('dataList').innerHTML = html;
                    document.getElementById('dataList').className = 'result success';
                })
                .catch(error => {
                    console.error('获取数据失败:', error);
                    document.getElementById('dataList').innerHTML = '获取数据失败: ' + error.message;
                    document.getElementById('dataList').className = 'result error';
                });
        }

        // 查看记录
        function viewRecord() {
            const id = document.getElementById('viewId').value;
            if (!id) {
                alert('请输入记录ID');
                return;
            }

            fetch(`/WarehouseManagement/Codingmanagement/GetById/${id}`)
                .then(response => response.json())
                .then(data => {
                    console.log('查看记录:', data);
                    let html = '<strong>查看结果：</strong><br>';
                    if (data.code === 0 && data.data) {
                        const record = data.data;
                        html += `<div style="line-height: 2;">`;
                        html += `<div><strong>ID:</strong> ${record.id}</div>`;
                        html += `<div><strong>条码:</strong> ${record.barCode || ''}</div>`;
                        html += `<div><strong>条码格式:</strong> ${record.barFormat || ''}</div>`;
                        html += `<div><strong>条码类型:</strong> ${record.barTypes || ''}</div>`;
                        html += `<div><strong>条码内容:</strong> ${record.barContext || ''}</div>`;
                        html += `<div><strong>业务编码:</strong> ${record.businessCode || ''}</div>`;
                        html += `<div><strong>业务名称:</strong> ${record.businessName || ''}</div>`;
                        html += `<div><strong>是否生效:</strong> ${record.isNo || ''}</div>`;
                        html += `</div>`;
                        document.getElementById('viewResult').className = 'result success';
                    } else {
                        html += `<p style="color: red;">查看失败: ${data.msg}</p>`;
                        document.getElementById('viewResult').className = 'result error';
                    }
                    document.getElementById('viewResult').innerHTML = html;
                })
                .catch(error => {
                    console.error('查看记录失败:', error);
                    document.getElementById('viewResult').innerHTML = '查看记录失败: ' + error.message;
                    document.getElementById('viewResult').className = 'result error';
                });
        }

        // 删除记录
        function deleteRecord() {
            const id = document.getElementById('deleteId').value;
            if (!id) {
                alert('请输入记录ID');
                return;
            }

            if (!confirm('确定要删除这条记录吗？')) {
                return;
            }

            fetch(`/WarehouseManagement/Codingmanagement/Delete/${id}`, {
                method: 'POST'
            })
                .then(response => response.json())
                .then(data => {
                    console.log('删除结果:', data);
                    let html = '<strong>删除结果：</strong><br>';
                    if (data.code === 0) {
                        html += `<p style="color: green;">删除成功！</p>`;
                        document.getElementById('deleteResult').className = 'result success';
                        // 自动刷新数据列表
                        setTimeout(loadData, 1000);
                    } else {
                        html += `<p style="color: red;">删除失败: ${data.msg}</p>`;
                        document.getElementById('deleteResult').className = 'result error';
                    }
                    document.getElementById('deleteResult').innerHTML = html;
                })
                .catch(error => {
                    console.error('删除记录失败:', error);
                    document.getElementById('deleteResult').innerHTML = '删除记录失败: ' + error.message;
                    document.getElementById('deleteResult').className = 'result error';
                });
        }

        // 添加测试数据
        function addTestData() {
            const testData = {
                barCode: 'TEST' + Date.now(),
                barFormat: 'QR二维码',
                barTypes: '产品条码',
                barContext: '测试条码内容' + Date.now(),
                businessCode: 'BUS' + Date.now(),
                businessName: '测试业务名称',
                isNo: '是'
            };

            fetch('/WarehouseManagement/Codingmanagement/Add', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(testData)
            })
                .then(response => response.json())
                .then(data => {
                    console.log('添加结果:', data);
                    let html = '<strong>添加结果：</strong><br>';
                    if (data.code === 0) {
                        html += `<p style="color: green;">添加成功！新记录ID: ${data.id}</p>`;
                        html += `<p>添加的数据: ${JSON.stringify(testData, null, 2)}</p>`;
                        document.getElementById('addResult').className = 'result success';
                        // 自动刷新数据列表
                        setTimeout(loadData, 1000);
                    } else {
                        html += `<p style="color: red;">添加失败: ${data.msg}</p>`;
                        document.getElementById('addResult').className = 'result error';
                    }
                    document.getElementById('addResult').innerHTML = html;
                })
                .catch(error => {
                    console.error('添加数据失败:', error);
                    document.getElementById('addResult').innerHTML = '添加数据失败: ' + error.message;
                    document.getElementById('addResult').className = 'result error';
                });
        }

        // 页面加载时自动获取数据
        window.onload = function() {
            loadData();
        };
    </script>
</body>
</html> 